<template style="color: #E3FFD4;">
  <view style="background-color: #E3FFD4;">
    <view class="">
      <dl style="display: flex; justify-content: space-between; background-color: yellow; width: 90%; margin: 0 auto; 
        border: 1px solid #B98452; box-sizing: border-box;">
        <dt style="background-color: aqua; border-radius: 50%; margin: 85rpx auto; height: 150rpx; width: 150rpx;">
          <img src="" alt="" />
          <!-- 添加头像照片 -->
        </dt>
        <dt
          style="background-color: green; margin-right: 50rpx; width: 300rpx; height: 150rpx; margin: auto; padding: 30rpx; box-sizing: border-box;">
          <h3>李子</h3>
          <!-- 添加昵称 -->
          <h5>好好学习，天天向上</h5>
        </dt>
        <dt>
          <button class="mini-btn" type="default" size="mini"
            style="border-radius: 25%; margin-top: 100%; margin-right: 10rpx; background-color: #E0F5E7;">签到</button>
        </dt>
      </dl>
    </view>




    <view class="" style="display: flex;">
      <image src="/static/VIP.png" mode="" style="width: 60%; height: 50rpx; margin: 5rpx auto; display: block;">
      </image>
      <button class="mini-btn" type="default" size="mini"
        style="background-color: #B98452; border-radius: 50%;">免费领取</button>
    </view>
  </view>

  <view class="" style="height:100rpx; background-color: #E3FFD4;">

  </view>

  <view class="" style="background-color: #E3FFD4; height: 630rpx; padding: 20rpx;">
    <button style="margin: 8rpx; margin-top: 15rpx; display: flex; align-items: center;">
      <img src="/static/我的.png" alt="" style="height: 55rpx; margin-right: 10rpx;" /> <!-- 留出10rpx间隙 -->
      <span style="font-size: 30rpx;">我的资料</span>
    </button>

    <button style="margin: 8rpx; margin-top: 15rpx; display: flex; align-items: center;">
      <img src="/static/目标.png" alt="" style="height: 55rpx; margin-right: 10rpx;" /> <!-- 留出10rpx间隙 -->
      <span style="font-size: 30rpx;">我的学习目标</span>
    </button>

    <button style="margin: 8rpx; margin-top: 15rpx; display: flex; align-items: center;">
      <img src="/static/包包.png" alt="" style="height: 55rpx; margin-right: 10rpx;" /> <!-- 留出10rpx间隙 -->
      <span style="font-size: 30rpx;">购买记录</span>
    </button>

    <button style="margin: 8rpx; margin-top: 15rpx; display: flex; align-items: center;">
      <img src="/static/推荐服务.png" alt="" style="height: 55rpx; margin-right: 10rpx;" /> <!-- 留出10rpx间隙 -->
      <span style="font-size: 30rpx;">推荐给好友</span>
    </button>

    <button style="margin: 8rpx; margin-top: 15rpx; display: flex; align-items: center;">
      <img src="/static/客服.png" alt="" style="height: 55rpx; margin-right: 10rpx;" /> <!-- 留出10rpx间隙 -->
      <span style="font-size: 30rpx;">客服</span>
    </button>
  </view>

</template>


<style>
  .dl {
    margin: 10rpx;
  }
</style>

<script>
  export default {
    data() {
      return {

      }
    },
    methods: {

    }
  }
</script>